// Quasar SCSS (& Sass) Variables
// --------------------------------------------------
// To customize the look and feel of this app, you can override
// the Sass/SCSS variables found in Quasar's source Sass/SCSS files.

// Check documentation for full list of Quasar variables

// Your own variables (that are declared here) and Quasar's own
// ones will be available out of the box in your .vue/.scss/.sass files

// It's highly recommended to change the default colors
// to match your app's branding.
// Tip: Use the "Theme Builder" on Quasar's documentation website.

$primary: #1976d2;
$secondary: #26a69a;
$accent: #9c27b0;

$dark: #1d1d1d;

$positive: #21ba45;
$negative: #c10015;
$info: #31ccec;
$warning: #f2c037;

// 调整全局参数
$z-menu: 6100;
$tooltip-fontsize: 13px;
$animate-duration: 0.2s;

// 调整分隔条样式
$SPLIT_SIZE: 3px;
$SPLIT_COLOR: rgba($primary, 0.4);
.q-splitter {
  &__separator-area {
    &:hover,
    .q-splitter--active > div > & {
      background-color: $SPLIT_COLOR;
    }
  }
  &--vertical > &__separator > &__separator-area {
    left: -$SPLIT_SIZE;
    right: -$SPLIT_SIZE;
  }
  &--horizontal > &__separator > &__separator-area {
    top: -$SPLIT_SIZE;
    bottom: -$SPLIT_SIZE;
  }
}

// 调整侧滑栏样式
.q-drawer__backdrop {
  opacity: 0.3;
}
.q-drawer__resizer {
  > .q-splitter__separator > .q-splitter__separator-area {
    left: -$SPLIT_SIZE * 2;
    right: -$SPLIT_SIZE * 2;
  }
}

// 修复对话框最大化样式错误，并取消非最大化时的最大宽高限制
.q-dialog {
  &__inner {
    &--maximized {
      > div {
        height: 100% !important;
        width: 100% !important;
        max-height: 100vh !important;
        max-width: 100vw !important;
      }
    }
    &--minimized {
      > div {
        max-width: 100% !important;
        max-height: 100% !important;
      }
    }
  }
}

// 调整输入框占位词颜色
$PLACEHODER_OPACITY: 0.4 !important;
.q-placeholder {
  &::-webkit-input-placeholder {
    opacity: $PLACEHODER_OPACITY;
  }
  &::-moz-placeholder {
    opacity: $PLACEHODER_OPACITY;
  }
  &:-ms-input-placeholder {
    opacity: $PLACEHODER_OPACITY;
  }
  &::-ms-input-placeholder {
    opacity: $PLACEHODER_OPACITY;
  }
  &::placeholder {
    opacity: $PLACEHODER_OPACITY;
  }
}

// 修复虚拟滚动列表最后一行没有框线的问题
.q-virtual-scroll {
  > table {
    border-bottom: 1px solid #e0e0e0;
  }
}
